home *** CD-ROM | disk | FTP | other *** search
/ Dynamic HTML Construction Kit / Dynamic HTML Construction Kit.iso / source_code / dhtmlunl / dhtml.exe / CD Content / Chap25 / dun25_5.txt < prev    next >
Encoding:
Text File  |  1997-12-18  |  2.4 KB  |  81 lines
  1. //
  2. // zoomer.js
  3. // A Portable Canvas Mode Image Zoomer
  4. //
  5.  
  6. // True if we're using Navigator 4.0
  7. Nav40 = (document.layers) ? 1 : 0;
  8.  
  9. // True if a zoomed window is open
  10. cmWinOpen = false;
  11.  
  12. // Capture Click events
  13. if (Nav40) {
  14.  document.captureEvents(Event.MOUSEDOWN);
  15.  document.onmousedown = clicker;
  16. }
  17.  
  18. function clicker(e) {
  19.  // If an image is already showing, close the window
  20.  if (cmWinOpen) {
  21.   cmClose();
  22.   return false;
  23.  }
  24.  
  25.  // If the user clicked on a hyperlink that was one of our images,
  26.  // open the image
  27.  imURL = e.target.toString();
  28.  imExt = imURL.substring(imURL.lastIndexOf(".") + 1, imURL.length);
  29.  isImage = ( imExt == "gif" || imExt == "jpg" );
  30.  if (isImage) {
  31.   cmOpen(e)
  32.   return false;
  33.  }
  34.  
  35.  return true;
  36. }
  37.  
  38. // A function that opens the canvas mode window
  39. function cmOpen(e) {
  40.  // Enable universal write target
  41.  netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
  42.  
  43.  // Set window features for Canvas Mode
  44.  cmWinProps="titlebar=no,alwaysRaised=yes,dependent=yes
  45.  cmWinProps+=",hotkeys=no,resizable=yes";
  46.  
  47.  // Put the window off-screen until it's resized
  48.  cmWinProps+=",screenX=" + screen.width + ",screenY=" + screen.height;
  49.  
  50.  // Open the window
  51.  cmWindow=window.open("","",cmWinProps);
  52.  
  53.  // Write the document to the new window
  54.  cmWindow.document.write('<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 
  55. Transitional//EN"><HTML><HEAD><TITLE>Image</TITLE><STYLE TYPE="text/css">#divIm { position: 
  56. absolute; top: 0; left: 0 }</STYLE><BODY><DIV ID="divIm"><IMG SRC="' + e.target + '"></DIV>');
  57.  cmWindow.document.close;
  58.  
  59.  // Get the width and height of the image and resize the window
  60.  imWidth=cmWindow.document.divIm.document.images[0].width;
  61.  imHeight=cmWindow.document.divIm.document.images[0].height;
  62.  cmWindow.innerWidth=imWidth-4;
  63.  cmWindow.innerHeight=imHeight-4;
  64.  
  65.  // Now move it into view, centered on the mouse pointer
  66.  cmWindow.moveTo(e.screenX - (imWidth / 2) , e.screenY - (imHeight / 2));
  67.  
  68.  // Capture all mousedown events in it, so that a click will close it.
  69.  cmWindow.enableExternalCapture;
  70.  cmWindow.captureEvents(Event.MOUSEDOWN);
  71.  cmWindow.onmousedown=cmClose ;
  72.  
  73.  // Update cmWinOpen so that we know an image is being displayed
  74.  cmWinOpen = true;
  75. }
  76. // A function that simply closes the canvas mode window
  77. function cmClose() {
  78.  cmWindow.close();
  79.  cmWinOpen = false;
  80. }
  81.